<!--
内容：推荐至部门
作者：黄彪
日期： 20170706
-->

<template>
    <div>
        <Modal title="推荐至用人部门" v-show="false" v-model="modal8" :mask-closable="false">
            <div class="ivu-form">
                <div class="ivu-form-item">
                    <label class="ivu-form-item-label" style="width: 80px;">发送方</label>
                    <div class="ivu-form-item-content" style="margin-left: 80px;">
                        <Radio-group v-model="phone">
                            <Radio label="apple">
                                <span>快乐沃克邮箱</span>
                            </Radio>
                            <Radio label="android">
                                <span>自定义邮箱</span>
                            </Radio>
                        </Radio-group>

                        <span>qian.wang@qq.com</span>
                    </div>
                </div>
            </div>

            <div class="ivu-form">
                <div class="ivu-form-item">
                    <label class="ivu-form-item-label" style="width: 80px;">收件人</label>
                    <div class="ivu-form-item-content" style="margin-left: 80px;">
                        <Select v-model="model12" filterable multiple>
                            <Option v-for="item in cityList" :value="item.value" :key="item">{{ item.label }}</Option>
                        </Select>
                    </div>
                </div>
            </div>

            <div class="ivu-form">
                <div class="ivu-form-item">
                    <label class="ivu-form-item-label" style="width: 80px;">邮件主题</label>
                    <div class="ivu-form-item-content" style="margin-left: 80px;">
                        <i class="ivu-icon ivu-icon-load-c ivu-load-loop ivu-input-icon ivu-input-icon-validate"></i>
                        <input type="text" placeholder="" class="ivu-input">
                    </div>
                </div>
            </div>

            <div class="ivu-form">
                <div class="ivu-form-item">
                    <label class="ivu-form-item-label" style="width: 80px;">邮件内容</label>
                    <div class="ivu-form-item-content" style="margin-left: 80px;">
                        <div class="ivu-input-wrapper ivu-input-type">
                            <i class="ivu-icon ivu-icon-load-c ivu-load-loop ivu-input-icon ivu-input-icon-validate"></i>
                            <input type="text" placeholder="" class="ivu-input">
                        </div>
                    </div>
                </div>
            </div>

            <div slot="footer" class="text_center">
                <Button type="primary margin_right_15">提交</Button>
                <Button type="primary margin_right_15">保存</Button>
                <Button type="primary margin_right_15">取消</Button>
            </div>
        </Modal>

        <Modal title="推荐至用人部门" v-model="modal89" :mask-closable="false">
            <p slot="header" style="color:#f60;text-align:center"></p>
            <div>
                <div>miu姐:</div>
                <div>以下是最近几天筛选较符合要求的5份简历，请下载查看，随时等候您的反馈。辛苦了！</div>
                <div>北京快乐沃克科技有限公司  人力资源部</div>
                <div>2016年10月28日</div>
            </div>
            <div>
                <div>
                    <span>应聘者简历</span>
                </div>
                <div>
                    <ul class="list_u">
                        <li>

                        </li>
                    </ul>

                </div>
            </div>
            <div slot="footer"></div>
        </Modal>
    </div>
</template>

<script>
    //  富文本编辑器
    import VueQuillEditor from 'vue-quill-editor'
    // 引用数据字典
    import {salaryRange} from "../src/config/dataDictionary"

    export default {
        components: {
            VueQuillEditor
        },
        data: function() {
            return {
                modal8:false,
                modal89:true,
                model12:[],
                formCustom:{},
                // 富文本编辑器
                editorOption: {
                    // some quill options
                },
                content:"<h2>I am Example 1</h2>",
                model1:"beijing",
                // 多选配置
                phone:"apple",
                // 薪资范围
                salaryRange:salaryRange,
                // 下拉列表数据
                cityList: [
                    {
                        value: 'beijing',
                        label: '北京市'
                    },
                    {
                        value: 'shanghai',
                        label: '上海市'
                    },
                    {
                        value: 'shenzhen',
                        label: '深圳市'
                    },
                    {
                        value: 'hangzhou',
                        label: '杭州市'
                    },
                    {
                        value: 'nanjing',
                        label: '南京市'
                    },
                    {
                        value: 'chongqing',
                        label: '重庆市'
                    }
                ]
            }
        },
        methods: {
            onEditorBlur(editor) {
                console.log('editor blur!', editor)
            },
            onEditorFocus(editor) {
                console.log('editor focus!', editor)
            },
            onEditorReady(editor) {
                console.log('editor ready!', editor)
            }
        },
        computed: {
            editor() {
                return this.$refs.myTextEditor.quill
            }
        }
    }
</script>

<style scoped lang="scss">
    .postJob{
        min-width: 900px;
        max-width: 1200px;

        .ivu-form-item{
            padding: 0 12px;
            .ivu-form-item-label{
                line-height: 28px;
            }
            .necessary{
                color: #EEB03B;
                margin-left: 3px;
                line-height: 14px;
                font-size: 14px;
            }
        }
    }

</style>
